<%+header%>

<%
local fs   = require "nixio.fs"
local has_ping6 = fs.access("/bin/ping6") or fs.access("/usr/bin/ping6")
local has_traceroute6 = fs.access("/usr/bin/traceroute6")
%>

<script type="text/javascript" src="<%=resource%>/cbi.js"></script>
<script type="text/javascript">//<![CDATA[
	var stxhr = new XHR();

	function update_status(field, proto)
	{
		var tool = field.name;
		var addr = field.value;
		var protocol = proto ? "6" : "";

		var legend = document.getElementById('diag-rc-legend');
		var output = document.getElementById('diag-rc-output');

		if (legend && output)
		{

			//output.innerHTML =
				//'<img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /> ' +
				//'<%:Waiting for command to complete...%>';
			
    		layer.open({
	        	type: 1
    		    ,title: false //不显示标题栏
    	    	,closeBtn: false
		        ,area: '800px;'
    	    	,shade: 0.4
        		,id: '' //设定一个id，防止重复弹出
	    	    ,btn: ['确定']
    		    ,btnAlign: 'c'
	        	,moveType: 1 //拖拽模式，0或者1
	        	,content: '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 300;"><div id="loadings"><img src="<%=resource%>/icons/loading.gif" alt="<%:Loading%>" style="vertical-align:middle" /><%:Waiting for command to complete...%></div></div>'
    		});


			//legend.parentNode.style.display = 'block';
			//legend.style.display = 'inline';
			var loadings = document.getElementById('loadings');

			stxhr.get('<%=luci.dispatcher.build_url("admin", "advanFunc")%>/diag_' + tool + protocol + '/' + addr, null,
				function(x)
				{
					if (x.responseText)
					{						
						legend.style.display = 'none';
						loadings.innerHTML = String.format('<pre>%h</pre>', x.responseText);
						output.innerHTML = String.format('<pre style="display:none;">%h</pre>', x.responseText);
					}
					else
					{						
						legend.style.display = 'none';
						loadings.innerHTML = '<span class="error"><%:Bad address specified!%></span>';
						output.innerHTML = '<span class="error" style="display:none;"><%:Bad address specified!%></span>';

					}
				}
			);
		}
	}
//]]></script>     
<style>
.netDiagInput{
	margin-bottom: 10px;
}
.Ping {
	margin-left: 30px;
}
#loadings pre{
	background: #393D49;
	border: 0px;
}
</style>                                                           
<diiv class="netDiagContainers">
    <div class="netDiag">
        <div class="title">
            <span>网络诊断</span>
        </div>
        <div class="titLine" style="width: 100%;height: 2px;"></div>
        <form method="post" action="<%=pcdata(luci.http.getenv("REQUEST_URI"))%>">
	<div class="cbi-map">
		<fieldset class="cbi-section">
			<div style="width:33%; float:left;height:120px;">
				<input class="netDiagInput" type="text" value="dev.openwrt.org" name="ping" /><br />
				<% if has_ping6 then %>
				<select name="ping_proto" style="width:auto">
					<option value="" selected="selected"><%:IPv4%></option>
					<option value="6"><%:IPv6%></option>
				</select>
				<input type="button" value="<%:Ping%>" class="cbi-button cbi-button-apply netDiagBtn Ping" onclick="update_status(this.form.ping, this.form.ping_proto.selectedIndex)" />
				<% else %>
				<input type="button" value="<%:Ping%>" class="cbi-button cbi-button-apply netDiagBtn Ping" onclick="update_status(this.form.ping)" />
				<% end %>
			</div>

			<div style="width:33%; float:left;height:120px;">
				<input class="netDiagInput" type="text" value="dev.openwrt.org" name="traceroute" /><br />
				<% if has_traceroute6 then %>
				<select name="traceroute_proto" style="width:auto">
					<option value="" selected="selected"><%:IPv4%></option>
					<option value="6"><%:IPv6%></option>
				</select>
				<input type="button" value="<%:Traceroute%>" class="cbi-button cbi-button-apply netDiagBtn Traceroute" onclick="update_status(this.form.traceroute, this.form.traceroute_proto.selectedIndex)" />
				<% else %>
				<input type="button" value="<%:Traceroute%>" class="cbi-button cbi-button-apply netDiagBtn Traceroute" onclick="update_status(this.form.traceroute)" />
				<% end %>
				<% if not has_traceroute6 then %>
					<p>&#160;</p>
					<p style="width: 200%;"><%:Install iputils-traceroute6 for IPv6 traceroute%></p>
				<% end %>
			</div>

			<div style="width:33%; float:left;height:120px;">
				<input class="netDiagInput" type="text" value="dev.openwrt.org" name="nslookup" /><br />
				<input type="button" value="<%:Nslookup%>" class="cbi-button cbi-button-apply netDiagBtn Nslookup" onclick="update_status(this.form.nslookup)" />
			</div>

			<br style="clear:both" /><br />

		</fieldset>
	</div>

	<fieldset class="cbi-section" style="display:none">
		<legend id="diag-rc-legend"><%:Collecting data...%></legend>
		<span id="diag-rc-output"></span>
	</fieldset>
</form>
    </div>
</diiv>
<%+footer%>